<!--上传图片-->
{load href="__PUBLIC__/js/jquery.form.min.js" /}
<script type="text/javascript">
    var uploadUrl = "{:url('main/upload')}";
</script>
<td align="right">[tip]</td>
<td>
<div class="litpic_show"> 
    <div id="images_area">
        <!--图片集-->
        {if condition="isset($item) and isset($item['pictureurls']) and !isset($item['shorttitle']) and $item['pictureurls'] neq null" }
            {volist name="item['pic_url']" id="pic"}
                <div class="picture_item">
                    <img src="{$pic}" width="110" height="110">
                    <div class="upload_success"></div>
                    <div class="index_picture">设为封面</div>
                    <div class="layui-layer-ico picture_del"></div>
                    <input type="hidden" name="pic_url[]" value="{$pic}" />
                </div>
            {/volist}
        {/if}
        <!--文章缩略图 shorttitle 字段判断是否来自文章模型-->
        {if condition="isset($item) and isset($item['shorttitle']) and $item['litpic'] neq null" }
            <div class="picture_item">
                <img src="{$item['litpic']}" width="110" height="110">
                <div class="upload_success"></div>
                <div class="index_picture">设为封面</div>
                <div class="layui-layer-ico picture_del"></div>
                <input type="hidden" name="pic_url[]" value="{$item['litpic']}" />
            </div>
            <div class="clear"></div>
        {/if}

        <!--友情链接logo  logo字段判断是否来自文章模型-->
        {if condition="isset($item['logo'])and $item['logo'] neq null" }
            <div class="picture_item">
                <img src="{$item['logo']}" width="110" height="110">
                <div class="upload_success"></div>
                <div class="index_picture">设为封面</div>
                <div class="layui-layer-ico picture_del "></div>
                <input type="hidden" name="pic_url[]" value="{$item['logo']}" />
            </div>
            <div class="clear"></div>
        {/if}

        <!--banner大图 img字段判断是否来自文章模型-->
        {if condition="isset($item['img'])and $item['img'] neq null" }
            <div class="picture_item">
                <img src="{$item['img']}" width="110" height="110">
                <div class="upload_success"></div>
                <div class="index_picture">设为封面</div>
                <div class="layui-layer-ico picture_del "></div>
                <input type="hidden" name="pic_url[]" value="{$item['img']}" />
            </div>
            <div class="clear"></div>
        {/if}
    </div>                  

    <div class="btn_up">
        <a href="javascript:;" class="file">
            <input type="file" name="pic_url" id="picture_upload">
        </a>
        <div class="tip"></div>
    </div>
</div>
</td>
<script type="text/javascript">
$(function () {
    //图片上传
    upload_max = typeof(upload_max) == 'undefined'?1:upload_max;
    
    var $imgarea = $('#images_area');
    var $tip = $(".tip");
    $("#picture_upload").wrap("<form id='picture_form' action='{:url('main/upload')}' method='post' enctype='multipart/form-data'></form>");
    $("#picture_upload").change(function(){
        if($("#picture_upload").val() == "") return;
        if ($("#images_area>.picture_item").length >= upload_max ) {layer.msg('最多上传'+ upload_max +'张图片');return;}
    
        $("#picture_form").ajaxSubmit({
            dataType:  'json',
            beforeSend: function() {
                $tip.html("上传中...").show();
            },
            data:{
                act:'add'
            },
            success: function(data) {
                if(data.status == 1){    
                    $tip.hide();                   
                    var img = data.path;
                    var picture_html= '<div class="picture_item"><img src="'+ img +'" width="110" height="110"><div class="upload_success"></div><div class="index_picture">设为封面</div><div class="layui-layer-ico picture_del"></div><input type="hidden" name="pic_url[]" value="'+ img +'" /></div>';
                    $('#images_area').append(picture_html);
                } else {
                    $tip.html(data.msg);
                }
            },
            error:function(xhr){
                layer.msg("上传失败"+xhr+",请重新选择上传");
            }
        });
    });

    //删除图片
    $('#images_area').on('click','.picture_del',function () {
        var $this = $(this);
        var img = $this.next().val();
        $.ajax(uploadUrl, {
            dataType:  'json',
            data:{
                act:'del',
                path:img
            },
            type: 'post',
            success: function(data) {
                if(data.status == 1){
                    layer.msg(data.msg);
                    $this.parent().remove();
                } else {
                    layer.msg(data.msg)
                }
            },
            error:function(xhr){
                layer.msg("删除失败"+xhr+",请重新删除");
            }
        });
    });

    //设为封面
    $('#images_area').on('click','.index_picture',function () {
        var $parent = $(this).parents('.picture_item');
        $(this).parent().remove();
        $('#images_area').prepend($parent);
    });
});
</script>